<!-- setup 语法糖用了这个 咱们组件就不需要 export -->
<script setup lang="ts">
// 逻辑
</script>

<template>
  <div class="header">
    <!-- 结构 -->
    头部组件
    <HMButton></HMButton>
  </div>
</template>

<style scoped>
/* scoped 添加给 style 标签之后
  1. 给当前页面的组件 添加 data-v-哈希值 的一个属性
  2. 给 css 的选择器增加 
    选择器[data-v-哈希值] 限制条件多了一个
  3. css 选择器只能命中当前页面的元素

*/
/* 样式 */
.header {
  height: 100px;
  background-color: pink;
}
/* 默认会全部生效 */
div {
  border: 10px yellow solid;
}
</style>
